<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2021/10/20
  Time: 13:56
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<!-- saved from url=(0029)https://www.hiyd.com/dongzuo/ -->
<html>
<head>

    <!-- Mobile Specific Meta -->
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Author Meta -->
    <meta name="author" content="colorlib">
    <!-- Meta Description -->
    <meta name="description" content="">
    <!-- Meta Keyword -->
    <meta name="keywords" content="">
    <!-- meta character set -->
    <meta charset="UTF-8">
    <!-- Site Title -->
    <title>GO运动</title>


    <!--
    CSS
    ============================================= -->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/front/css/linearicons.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/front/css/font-awesome.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/front/css/bootstrap.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/front/css/magnific-popup.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/front/css/nice-select.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/front/css/animate.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/front/css/owl.carousel.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/front/css/jquery-ui.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/front/css/main.css">
    <script src="${pageContext.request.contextPath}/style/js/jquery.min.js" type="text/javascript"></script>

    <style>

        h3 {
            color: white;
        }
    </style>

    <script>

        $(function () {


            /*导航栏变化*/
            var user="<c:out value='${sessionScope.user.userName}' />";
            var img1="<c:out value='${sessionScope.user.userImg}' />";
            var info="";
            if(user){
                info="<li class=\"menu-has-children\"><img src=\'${pageContext.request.contextPath}/TypeOfDownloadServlet?fileName=${sessionScope.user.userImg}\' style=\"height: 25px;\n" +
                    "    width: 25px;\n" +
                    "    border-radius: 50%;\" onerror=\"this.src=\'${pageContext.request.contextPath}/style/images/titlel.jpg\'\" ><a style=\"color: black; font-size: 15px;    position: absolute;\n" +
                    "    top: 4px;\n" +
                    "    right: -65px;\">"+user+"</a>\n" +
                    "\t\t\t\t\t\t\t\t\t<ul>\n" +
                    "\t\t\t\t\t\t\t\t\t\t<li><a href=\"${pageContext.request.contextPath}/front/CenTer.jsp\">个人中心</a></li>\n" +
                    "\t\t\t\t\t\t\t\t\t\t<li><a href=\"javascript:void(0)\" id=\"exit\">退出</a></li>\n" +
                    "\t\t\t\t\t\t\t\t\t</ul>\n" +
                    "\t\t\t\t\t\t\t\t</li>"
                $("#me").html(info);
            }else{
                info="<span ><a href=\"${pageContext.request.contextPath}/login/userLogin.jsp\">登录</a></span>|\n" +
                    "\t\t\t\t\t\t\t\t\t<span ><a href=\"${pageContext.request.contextPath}/register/userRegister.jsp\">注册</a></span>"
                $("#me").html(info);
            }
            /*前端退出*/
            $(document).on("click","#exit",function(){
                $.ajax({
                    async:true,
                    type:"get",
                    url:"${pageContext.request.contextPath}/UserController/exit",
                    success:function (data) {
                        info="<span ><a href=\"${pageContext.request.contextPath}/login/userLogin.jsp\">登录</a></span>|\n" +
                            "\t\t\t\t\t\t\t\t\t<span ><a href=\"${pageContext.request.contextPath}/register/userRegister.jsp\">注册</a></span>"
                        $("#me").html(info);
                    }
                })
            })


            $.get("${pageContext.request.contextPath}/FirstTypeOfVideoController/showAllFirstType", {}, function (data) {
                console.log(data);
                showType(data);

            }, "json");

            $.get("${pageContext.request.contextPath}/VideoOfTypeController/showVideoById",
                {}, function (data) {
                    console.log(data.list);
                    showVideo(data.list);
                }, "json");



            $(document).on("click",".sort-item",function () {
                var a=$(this).attr("class");
                if (a=="sort-item"){
                    $(this).attr("class","sort-item selected");
                }
                if (a=="sort-item selected"){
                    $(this).attr("class","sort-item");
                }

                var targetList=[];
                var partList=[];
                var degreeList=[];
                var apparatusList=[];
                var i=0;
                $("#target .selected").each(function () {
                    var targetId=$(this).attr("id");
                    targetList.push(targetId);
                })
                $("#bodyPart .selected").each(function () {
                    var partId=$(this).attr("id");
                    partList.push(partId);
                })
                $("#degree .selected").each(function () {
                    var degreeId=$(this).attr("id");
                    degreeList.push(degreeId);
                })
                $("#apparatus .selected").each(function () {
                    var apparatusId=$(this).attr("id");
                    apparatusList.push(apparatusId);
                })
                console.log(targetList);
                console.log(partList);
                console.log(degreeList);
                console.log(apparatusList);

                $.get("${pageContext.request.contextPath}/VideoOfTypeController/showVideoById",
                    {
                        targetList:JSON.stringify(targetList),
                        partList:JSON.stringify(partList),
                        degreeList:JSON.stringify(degreeList),
                        apparatusList:JSON.stringify(apparatusList)
                    }, function (data) {
                        showVideo(data.list);
                }, "json");

                /*$.ajax({
                                    url: "${pageContext.request.contextPath}/VideoOfTypeController/showVideoById",
                    type: "POST",  //查询
                    data: {targetList:JSON.stringify(targetList)},
                    dataType: "JSON",
                    success: function (result) {
                        showData(result);

                    },
                    error: function (xhr, i, e) {

                    }
                })*/
            })

        })



        /*动态生成二级分类标签*/
        function showType(data) {

            $.each(data, function (index, fisrtType) {
                var firstTypeName = fisrtType.firstTypeName;
                if (firstTypeName == "目标") {
                    $("#target").empty();
                    $.each(fisrtType.list, function (index, secondType) {
                        $("#target").append("<a href=\"javascript:void(0)\" class=\"sort-item\" id=\""+
                            secondType.secondTypeId+"\" title=\"\">" +
                            secondType.secondTypeName + "</a>");
                    })
                } else if (firstTypeName == "部位") {

                    $("#bodyPart").empty();
                    $.each(fisrtType.list, function (index, secondType) {
                        $("#bodyPart").append("<a href=\"javascript:void(0)\" class=\"sort-item\" id=\""+
                            secondType.secondTypeId+"\" title=\"\">" +
                            secondType.secondTypeName + "</a>");
                    })
                } else if (firstTypeName == "难度") {
                    $("#degree").empty();
                    $.each(fisrtType.list, function (index, secondType) {
                        $("#degree").append("<a href=\"javascript:void(0)\" class=\"sort-item\" id=\""+
                            secondType.secondTypeId+"\" title=\"\">" +
                            secondType.secondTypeName + "</a>");
                    })
                } else if (firstTypeName == "器械") {
                    $("#apparatus").empty();
                    $.each(fisrtType.list, function (index, secondType) {
                        $("#apparatus").append("<a href=\"javascript:void(0)\" class=\"sort-item\" id=\""+
                            secondType.secondTypeId+"\" title=\"\">" +
                            secondType.secondTypeName + "</a>");
                    })
                }
            })

        }


        /*根据分类动态生成视频标签*/
        function showVideo(data) {
            $("#courseList").empty();
            $.each(data,function (index, course) {

                /*通过二级标签编号获取二级标签名称*/
                var t=$("#"+course.targetId).html();
                var p=$("#"+course.partId).html();
                var d=$("#"+course.degreeId).html();
                var a=$("#"+course.apparatusId).html();

                var v=course.publishState;
                console.log(course.pulishState);

                if (v=="1"){
                    $("#courseList").append("<li class=\"hvr-glow\">\n" +
                        "   <a target=\"_blank\" href=\"${pageContext.request.contextPath}/VideoOfTypeController/showVideoPlay?videoId="+
                        course.videoId+"\">\n" +
                        "<span class=\"avatar\" style=\"height:160px\">\n" +
                        "<img class=\"avatar-default\"\n" +
                        "    src=\"${pageContext.request.contextPath}/TypeOfDownloadServlet?fileName="+course.videoImg+
                        "\" onerror=\"this.src=\'${pageContext.request.contextPath}/actionlibrary/actionlibrary_files/temp.png\'\">\n" +
                        "<div class=\"avatar-pic \">\n" +
                        "<img src=\"${pageContext.request.contextPath}/TypeOfDownloadServlet?fileName="+course.videoImg+"\n" +
                        " \" onerror=\"this.src=\'${pageContext.request.contextPath}/actionlibrary/actionlibrary_files/temp.png\'\">\n" +
                        "</div>\n" +
                        "<i class=\"mask\"></i>\n" +
                        "</span>\n" +
                        "     </a>\n" +
                        "      <div class=\"cont\">\n" +
                        "      <a target=\"_blank\" href=\"\"><span\n" +
                        "           class=\"title\">"+course.courseName+"</span></a>\n" +
                        "              <div class=\"tag\">\n" +
                        "      <span>"+t+"</span>\n" +
                        "      <span>"+p+"</span>\n" +
                        "      <span>"+d+"</span>\n" +
                        "      <span>"+a+"</span>\n" +
                        "      <span style=\"color:red\">VIP专属</span>\n" +
                        "     </div>\n" +
                        "    </div>\n" +
                        "\n" +
                        "     </li>");
                }else {
                    $("#courseList").append("<li class=\"hvr-glow\">\n" +
                        "   <a target=\"_blank\" href=\"${pageContext.request.contextPath}/VideoOfTypeController/showVideoPlay?videoId="+
                        course.videoId+"\">\n" +
                        "<span class=\"avatar\" style=\"height:160px\">\n" +
                        "<img class=\"avatar-default\"\n" +
                        "    src=\"${pageContext.request.contextPath}/TypeOfDownloadServlet?fileName="+course.videoImg+
                        "\" onerror=\"this.src=\'${pageContext.request.contextPath}/actionlibrary/actionlibrary_files/temp.png\'\">\n" +
                        "<div class=\"avatar-pic \">\n" +
                        "<img src=\"${pageContext.request.contextPath}/TypeOfDownloadServlet?fileName="+course.videoImg+"\n" +
                        " \" onerror=\"this.src=\'${pageContext.request.contextPath}/actionlibrary/actionlibrary_files/temp.png\'\">\n" +
                        "</div>\n" +
                        "<i class=\"mask\"></i>\n" +
                        "</span>\n" +
                        "     </a>\n" +
                        "      <div class=\"cont\">\n" +
                        "      <a target=\"_blank\" href=\"\"><span\n" +
                        "           class=\"title\">"+course.courseName+"</span></a>\n" +
                        "              <div class=\"tag\">\n" +
                        "      <span>"+t+"</span>\n" +
                        "      <span>"+p+"</span>\n" +
                        "      <span>"+d+"</span>\n" +
                        "      <span>"+a+"</span>\n" +
                        "     </div>\n" +
                        "    </div>\n" +
                        "\n" +
                        "     </li>");
                }



            })



        }

    </script>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit">
    <!-- <meta name="viewport" content="width=device-width,initial-scale=1.0"> -->
    <meta name="applicable-device" content="pc">
    <meta name="mobile-agent" content="format=html5;url=http://m.hiyd.com/dongzuo/">
    <link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.hiyd.com/dongzuo/">
    <title>GO健身课程库：健身动作大全，详细动作图解和动作视频教学！</title>
    <meta name="keywords" content="健身动作教程，健身动作详细图解，健身动作视频，健身肌肉展示，健身动作分解">
    <meta name="description" content="GO健身动作库，是国内最专业的健身动作库，提供最全的健身动作视频，健身动作图解，肌肉分析。让你学习健身，了解动作。">
    <link href="${pageContext.request.contextPath}/actionlibrary/actionlibrary_files/global.css" rel="stylesheet">
    <script src="${pageContext.request.contextPath}/actionlibrary/actionlibrary_files/hm.js.下载"></script>
</head>
<body>
<div class="o-hiyd">
    <script>
        SITE_URL = "/";
    </script>
    <script src="${pageContext.request.contextPath}/actionlibrary/actionlibrary_files/seajs.utils.js.下载"></script>

    <header id="header">
        <%--		<div class="header-top">
                    <div class="container">
                        <div class="row align-items-center justify-content-center">
                            <div class="col-md-4 col-4 header-top-left no-padding">
                              <a href="mailto:support@colorlib.com"><span class="lnr lnr-location"></span></a>
                              <a class="contact-texts" href="mailto:support@colorlib.com">support@colorlib.com</a>
                            </div>
                            <div class="col-md-4 col-4 header-top-bottom no-padding">
                              <a href="index1.jsp"><img class="img-fluid" src="${pageContext.request.contextPath}/page/img/logo.png" alt="" title="" /></a>
                            </div>
                            <div class="col-md-4 col-4 header-top-right no-padding">
                              <a class="contact-texts" href="tel:+440 123 12 658 439">+440 123 12 658 439</a>
                              <a href="tel:+440 123 12 658 439"><span class="lnr lnr-phone-handset"></span></a>
                            </div>
                        </div>
                    </div>
              </div>--%>
        <div class="container main-menu">
            <div class="row align-items-center justify-content-center">
                <nav id="nav-menu-container">
                    <ul class="nav-menu">
                        <li class="menu-active"><a href="${pageContext.request.contextPath}/page/index1.jsp">首页</a></li>
                        <li><a href="${pageContext.request.contextPath}/actionlibrary/actionlibrary.jsp">健身课程库</a></li>
                        <li><a href="${pageContext.request.contextPath}/page/services.jsp">特设课堂</a></li>
                        <li><a href="${pageContext.request.contextPath}/page/trainers.jsp">图库</a></li>
                        <li class="menu-has-children"><a href="">更多</a>
                            <ul>
                                <li><a href="${pageContext.request.contextPath}/front/FavoritePage.jsp">我的收藏</a></li>
                                <li><a href="${pageContext.request.contextPath}/front/HistoryPage.jsp">历史记录</a></li>
                            </ul>
                        </li>
                        <li><a href="${pageContext.request.contextPath}/page/elements.jsp">联系我们</a></li>
                        <li><a href="${pageContext.request.contextPath}/page/contact.jsp">关于我们</a></li>
                        <li>


                            <div class="item-group" id="me">


                            </div>
                        </li>
                    </ul>
                </nav><!-- #nav-menu-container -->
            </div>
        </div>
    </header><!-- #header -->


    <!-- <div class="o-hiyd-header">
hi运动头部
</div> -->
    <div class="o-exercise page" id="o-exercise" page-type="list">
        <div class="o-exercise-aside" id="exercise-aside">
            <div class="sort-menu" tabindex="0" style="overflow: hidden; outline: none;">
                <div class="menu-search">
                    <div class="aside-search">
                        <form method="get" id="asideSearchForm" name="asideSearchForm"
                              action="https://www.hiyd.com/dongzuo/">
                            <input class="typeahead" data-url="" id="acTrigger3" type="text" value=""
                                   autocomplete="off" placeholder="课程名">
                        </form>
                        <span class="aside-icon-search"></span>
                    </div>
                </div>


                <div id="group_exercise" class="menu-group group-tp2 group-expand">
                    <div class="group-hd" style="cursor: default">
                        <i></i>
                        <h3>训练课程</h3><em></em>
                    </div>


                    <div class="group-bd">

                        <div class="menu-item training-hard">
                            <div class="menu-item-hd">
                                <h3 class="menu-label">训练目标</h3>
                            </div>
                            <div class="menu-item-bd" id="target">
                                <%--<a href="" class="sort-item selected">不限目标</a>
                                <a href="" class="sort-item" title="">减脂 </a>--%>
                            </div>
                        </div>

                        <div class="menu-item training-part">
                            <div class="menu-item-hd">
                                <h3 class="menu-label">训练部位</h3>
                                <a target="_blank" href="https://www.hiyd.com/exercise/muscleShow/"
                                   class="sort-item item-muscle-show">肌肉展示</a>
                            </div>
                            <div class="menu-item-bd" id="bodyPart">
                                <%--<a href="" class="sort-item selected">不限部位</a>
                                <a href="" class="sort-item" title="">肱二头肌 </a>--%>
                            </div>
                        </div>

                        <div class="menu-item training-hard">
                            <div class="menu-item-hd">
                                <h3 class="menu-label">训练难度</h3>
                            </div>
                            <div class="menu-item-bd" id="degree">
                                <%--<a href="" class="sort-item selected">不限难度</a>
                                <a href="" class="sort-item" title="初级">初级 </a>
                                <a href="" class="sort-item" title="中级">中级 </a>
                                <a href="" class="sort-item" title="高级">高级 </a>--%>
                            </div>
                        </div>

                        <div class="menu-item instrument">
                            <div class="menu-item-hd">
                                <h3 class="menu-label">器械要求</h3>
                            </div>
                            <div class="menu-item-bd" id="apparatus">
                                <%--<a href="" class="sort-item selected">不限器械</a>
                                <a href="" class="sort-item" title="">徒手训练 </a>--%>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
            <a href="javascript:void(0)" class="menu-handler">开关</a>
            <div id="ascrail2000" class="nicescroll-rails nicescroll-rails-vr"
                 style="width: 6px; z-index: 100; cursor: default; position: absolute; top: 51px; left: 269px; height: 788px; opacity: 1; display: block;">
                <div class="nicescroll-cursors"
                     style="position: relative; top: 0px; float: right; width: 6px; height: 695px; background-color: rgb(73, 72, 74); border: rgb(73, 72, 74); background-clip: padding-box; border-radius: 5px;">
                </div>
            </div>
            <div id="ascrail2000-hr" class="nicescroll-rails nicescroll-rails-hr"
                 style="height: 6px; z-index: 100; top: 833px; left: 0px; position: absolute; opacity: 1; cursor: default; display: none; width: 269px;">
                <div class="nicescroll-cursors"
                     style="position: absolute; top: 0px; height: 6px; width: 275px; background-color: rgb(73, 72, 74); border: rgb(73, 72, 74); background-clip: padding-box; border-radius: 5px;">
                </div>
            </div>
        </div>
        <div class="o-exercise-main" style="height: 843px; overflow-y: auto;">
            <!-- 动作库{ -->
            <div class="o-pagemod">
                <div class="o-pagemod-hd">
                    <h1>全部课程</h1>
                </div>
                <div class="o-pagemod-bd">
                    <div class="o-exercise-list">
                        <ul id="courseList"><%--课程--%>




                            <%--<li class="hvr-glow">
                                <a target="_blank" href="https://www.hiyd.com/dongzuo/2/">
											<span class="avatar">
												<img class="avatar-default"
                                                     src="${pageContext.request.contextPath}/actionlibrary/actionlibrary_files/temp.png">
												<div class="avatar-pic ">
													<img src="${pageContext.request.contextPath}/actionlibrary/actionlibrary_files/d5f75ee44930473e9360136299d7317b.jpg"
                                                         alt="跪姿俯卧撑"
                                                         onerror="this.onerror=&#39;&#39;;this.src=&#39;/static/img/temp.png&#39;">
												</div>
												<i class="mask"></i>
											</span>
                                </a>
                                <div class="cont">
                                    <a target="_blank" href="https://www.hiyd.com/dongzuo/2/"><span
                                            class="title">跪姿俯卧撑</span></a>
                                    <div class="tag">
                                        <span>初级</span>
                                        <span>徒手训练</span>
                                        <span>胸部</span>
                                    </div>
                                </div>

                            </li>--%>






                        </ul>

                        <%--<div class="mod-page">
                            <a href="https://www.hiyd.com/dongzuo/?page=1" title="已经是当前页" class="current"
                               onclick="_pageClick(&#39;num&#39;, 1)">1</a>
                            <a href="https://www.hiyd.com/dongzuo/?page=2" title="第2页"
                               onclick="_pageClick(&#39;num&#39;, 2)">2</a>
                            <span>...</span>
                            <a href="https://www.hiyd.com/dongzuo/?page=80" title="第80页"
                                                onclick="_pageClick(&#39;num&#39;, 80)">80</a>
                            <a href="https://www.hiyd.com/dongzuo/?page=2" onclick="_pageClick(&#39;next&#39;)"
                               rel="next" title="下一页">下一页</a>

                            <ins>
                                <span>共80页</span>
                                <span>跳到第</span>
                                <input type="text" id="jumpto">
                                <span>页</span>
                                <button onclick="_pageClick(&#39;jump&#39;)">确定</button>
                            </ins>

                        </div>--%>


                        <script>
                            function parseQuery(qstr) {
                                var query = {};
                                var a = qstr.split('&');
                                for (var i in a) {
                                    var b = a[i].split('=');
                                    query[decodeURIComponent(b[0])] = decodeURIComponent(b[1]);
                                }

                                return query;
                            }

                            function serialize(obj, prefix) {
                                var str = [];
                                for (var p in obj) {
                                    if (obj.hasOwnProperty(p)) {
                                        var k = prefix ? prefix + "[" + p + "]" : p,
                                            v = obj[p];
                                        str.push(typeof v == "object" ?
                                            serialize(v, k) :
                                            encodeURIComponent(k) + "=" + encodeURIComponent(v));
                                    }
                                }
                                return str.join("&");
                            }

                            function _pageClick(act, num) {
                            }
                        </script>
                    </div>
                </div>
            </div>
            <!-- }动作库 -->
        </div>
    </div>
</div>
<script>
    // seajs.use('jquery', function($) {
    // 	$(".o-exercise-list .avatar-pic img").each(function(i, e) {
    // 		var ratio = $(e).width() / $(e).height();
    // 		if(ratio > 1.4 && ratio < 1.75) {
    // 			$(e).parents(".avatar-pic").addClass('fixSize');
    // 		}
    // 		$(e).css({
    // 			"visibility" : "visible"
    // 		})
    // 	});
    // });
</script>
<script>
    if (document.getElementById("o-goH5Link")) {
        document.getElementById("o-goH5Link").onclick = function () {
            var time = new Date();
            time.setTime(time.getTime() - 1 * 864e+5);
            time = time.toUTCString();
            document.cookie = "visit_type=; expires=" + time + "; path=/;" + " domain=hiyd.com";
        }
    }
    var _hmt = _hmt || [];
    (function () {
        var hm = document.createElement("script");
        var param = /ku\.hiyd\.com/.test(location.href) ? '70460135948fe5b1164e623fd4113858' :
            '27e0b89fc1f2e9d960a18d82d5f98dbd';
        hm.src = "//hm.baidu.com/hm.js?" + param;
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
    })();

    (function () {
        var bp = document.createElement('script');
        var curProtocol = window.location.protocol.split(':')[0];
        if (curProtocol === 'https') {
            bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
        } else {
            bp.src = 'http://push.zhanzhang.baidu.com/push.js';
        }
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(bp, s);
    })();

</script>

<script src="${pageContext.request.contextPath}/front/js/vendor/jquery-2.2.4.min.js"></script>
<script src="${pageContext.request.contextPath}/front/js/vendor/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/front/js/easing.min.js"></script>
<script src="${pageContext.request.contextPath}/front/js/hoverIntent.js"></script>
<script src="${pageContext.request.contextPath}/front/js/superfish.min.js"></script>
<script src="${pageContext.request.contextPath}/front/js/jquery.ajaxchimp.min.js"></script>
<script src="${pageContext.request.contextPath}/front/js/jquery.magnific-popup.min.js"></script>
<script src="${pageContext.request.contextPath}/front/js/jquery-ui.js"></script>
<script src="${pageContext.request.contextPath}/front/js/jquery.nice-select.min.js"></script>
<script src="${pageContext.request.contextPath}/front/js/owl.carousel.min.js"></script>
<script src="${pageContext.request.contextPath}/front/js/mail-script.js"></script>
<script src="${pageContext.request.contextPath}/front/js/main.js"></script>
</body>
<html>

